<%@page language="java" contentType="text/html; charset=UTF-8" isELIgnored="false" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="html" tagdir="/WEB-INF/tags" %>
<!DOCTYPE html>
<html>
<html:header title="序列号查询">

    <link rel="stylesheet" href="${baseUrl}css/public.css" media="all">

    <style type="text/css">
    </style>

    <script>
        jQuery(function () {
            fixTableOperatorButton();


            ajaxSelect("${baseUrl}organization/store/getStores.action","storeId","全部");
        });

        layui.use(['form', 'table','laydate'], function () {
            let $ = layui.jquery,
                form = layui.form,
                table = layui.table,
                laydate = layui.laydate,
                util = layui.util;

            laydate.render({
                elem: '#inDate',
                range:'~',
                done: function(value, date, endDate){
                    if (!emptyEntity(value)) {
                        $('[name="inDate1"]').val(getDateFromLayUiDate(date));
                        $('[name="inDate2"]').val(getDateFromLayUiDate(endDate));
                    } else {
                        $('[name="inDate1"]').val('');
                        $('[name="inDate2"]').val('');
                    }
                }
            });

            laydate.render({
                elem: '#outDate',
                range:'~',
                done: function(value, date, endDate){
                    if (!emptyEntity(value)) {
                        $('[name="outDate1"]').val(getDateFromLayUiDate(date));
                        $('[name="outDate2"]').val(getDateFromLayUiDate(endDate));
                    } else {
                        $('[name="outDate1"]').val('');
                        $('[name="outDate2"]').val('');
                    }
                }
            });

            renderTable();

            table.on('tool(table)', function (obj) {
                let data = obj.data;
                switch(obj.event){
                    case 'detail':
                        openTab("序列号跟踪","${baseUrl}house/goodsSnDetail.action?id="+data.id+"&goodsId="+data.goodsId);
                        break;
                }
            });


            form.on('select(storeId)', function (data) {
                ajaxSelect("${baseUrl}organization/house/getHouseByStore.action?storeId="+data.value,"houseId","全部");
            });




            form.on('submit(search)', function (data) {
                let json = data.field;
                table.reload('table',{where: json,page: {curr: 1}});
                return false;
            });

        });

        function clearSearch() {
            $("#searchForm")[0].reset();
            $('[name="inDate1"]').val('');
            $('[name="inDate2"]').val('');
            $('[name="outDate1"]').val('');
            $('[name="outDate2"]').val('');
        }

        function renderTable() {
            clearSearch();
            layui.table.render({
                id:'table',
                elem: '#table',
                url: "${baseUrl}house/goodsSn/getList.action",
                where : {
                    time:(new Date()).valueOf()
                },
                cols: [[
                    {type:'numbers'},
                    {field: 'id', width: 10, title: 'ID',hide:true},
                    {field: 'sn', width: 120, title: '序列号',style:"font-size:12px;"},
                    {width: 120, title: '商品编号',style:"font-size:12px;",templet: function (d) {
                            return d.goodsVo.no;
                        }},
                    {minWidth: 150, title: '商品名称',style:"font-size:12px;",templet: function (d) {
                            return d.goodsVo.name;
                        }},
                    {width: 100, title: '规格',style:"font-size:12px;",templet: function (d) {
                            return d.goodsVo.norms==null?"":d.goodsVo.norms;
                        }},
                    {width: 120, title: '属性',style:"font-size:12px;",templet: function (d) {
                            return genAttr(d.goodsVo.attrNameVoList);
                        }},
                    {width: 80, title: '单位',style:"font-size:12px;",templet: function (d) {
                            return d.goodsVo.goodsUnitVoList[0].unit.name;
                        }},
                    {width: 100, title: '门店',style:"font-size:12px;",templet: function (d) {
                            return d.houseVo.store.name;
                        }},
                    {width: 100, title: '仓库',style:"font-size:12px;", templet: function (d) {
                            return d.houseVo.name;
                        }},
                    {width: 80, title: '状态',style:"font-size:12px;", templet: function (d) {
                            return d.status == 1 ? "在库" : "已出库";
                        }},

                    {width: 100, title: '入库日期',style:"font-size:12px;", templet: function (d) {
                            return d.inDate == null ? "" : GMTToDate(d.inDate);
                        }},
                    {width: 100, title: '出库日期',style:"font-size:12px;", templet: function (d) {
                            return d.outDate == null ? "" : GMTToDate(d.outDate);
                        }},
                    {title: '操作',fixed:'right', minWidth: 80, templet: '#operBar'},
                ]],
                limit: 10,
                page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                    layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                    //,curr: 5 //设定初始在第 5 页
                    ,groups: 5 //只显示 5 个连续页码
                    ,first: false //不显示首页
                    ,last: false //不显示尾页
                },
                done: function(res, curr, count){
                }
            });
        }
    </script>

</html:header>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <form class="layui-form layui-form-pane" action="" id="searchForm">


            <input type="hidden" name="inDate1">
            <input type="hidden" name="inDate2">
            <input type="hidden" name="outDate1">
            <input type="hidden" name="outDate2">


            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">其他信息</label>
                    <div class="layui-input-inline">
                        <input type="text" id="search" name="search" placeholder="序列号、备注、编号、名称、属性、条码" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <a class="layui-btn" lay-submit="" lay-filter="search" id="btn-search"><i class="layui-icon layui-icon-search"></i></a>
                    <a class="layui-btn" id="selectSearch">筛选</a>
                </div>

                <div class="table-tool-div-screen" status="close" style="display: none">

                    <div class="layui-inline">
                        <label class="layui-form-label">序列号</label>
                        <div class="layui-input-inline">
                            <input type="text" name="sn" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label">商品编号</label>
                        <div class="layui-input-inline">
                            <input type="text" name="no" class="layui-input">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label">商品名称</label>
                        <div class="layui-input-inline">
                            <input type="text" name="name" class="layui-input">
                        </div>
                    </div>


                    <div class="layui-inline">
                        <label class="layui-form-label">入库日期</label>
                        <div class="layui-input-inline">
                            <input type="text" id="inDate" placeholder="请选择范围" class="layui-input" autocomplete="off">
                        </div>
                    </div>

                    <div class="layui-inline">
                        <label class="layui-form-label">门店</label>
                        <div class="layui-input-inline">
                            <select name="storeId" lay-filter="storeId"></select>
                        </div>
                    </div>


                    <div class="layui-inline">
                        <label class="layui-form-label">仓库</label>
                        <div class="layui-input-inline">
                            <select name="houseId">
                                <option value="">全部</option>
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline" >
                        <label class="layui-form-label">序列号状态</label>
                        <div class="layui-input-inline">
                            <select name="status">
                                <option value="">全部</option>
                                <option value="1">在库</option>
                                <option value="2">已出库</option>
                            </select>
                        </div>
                    </div>



                    <div class="layui-inline">
                        <label class="layui-form-label">出库日期</label>
                        <div class="layui-input-inline">
                            <input type="text" id="outDate" placeholder="请选择范围" class="layui-input" autocomplete="off">
                        </div>
                    </div>

                    <div class="layui-form-item">
                        <a class="layui-btn" lay-submit="" lay-filter="search">搜索</a>
                        <a class="layui-btn layui-btn-primary" id="clearSearch">清空所有条件</a>
                    </div>
                </div>
                <script>
                    $("#selectSearch").click(function () {
                        if ($(".table-tool-div-screen").attr("status")=="close") {
                            $(".table-tool-div-screen").css("display","block");
                            $(".table-tool-div-screen").attr("status","open");
                            $("#search").parent().parent().css("display","none");
                            $("#search").val("");
                            $("#btn-search").css("display","none");
                            $(this).html("收起");
                        } else {
                            $(".table-tool-div-screen").css("display","none");
                            $(".table-tool-div-screen").attr("status","close");
                            $("#search").parent().parent().css("display","inline-block");
                            $("#btn-search").css("display","inline-block");
                            $(this).html("筛选");
                        }
                    });

                    $("#clearSearch").click(function () {

                        clearSearch();
                    });
                </script>
            </div>
        </form>

        <hr/>

        <table class="layui-hide" id="table" lay-filter="table" lay-size="sm"></table>

        <script type="text/html" id="operBar">
            <a class="layui-btn layui-btn-xs layui-btn-normal table-operator" lay-event="detail">详情</a>
        </script>
    </div>
</div>
</body>
<html:loading/>
</html>